
require(['./config'],()=>{
    require(['template','header','footer'],(template,header)=>{
        class buyCar{
            constructor(){
                this.renderBuycar()
                this.checkeChange()
                this.setnoCheckall()
                header.suanCar()

                this.delete()

                this.setMore()





            }
            //渲染购物车列表
            renderBuycar(){
                let cart= localStorage.getItem('cart')
                this.cart=JSON.parse(cart)
                if(cart){
                    this.cart=JSON.parse(cart)
                    $('#shopCar-list').html(template('shopCar-list-template',{
                        shoes:this.cart
                    }))

                    this.checkeChange()
                    this.setnoCheckall()
                    this.setcheckAll()
                    this.setMore()
                    this.setLittle()
                   this.setInput()
                   this.delete()
                   this.allCheck()

                }
                else {
                    $('.noshoes').show()
                }
                
                 

            }
            //渲染单选框的状态 改变状态
            checkeChange(){
                //当清单选按钮被改变事 应该改变localstorage里的当前商品的check状态 并重新渲染
                //找到当前商品 
                const _this=this
                $('.changeBox').on('change',function(){
                    //获取整个商品的id 对比localstorage的id是否相同
                    let id=$(this).parents('.shopCar-list').attr('data-id')
                    _this.cart=_this.cart.map((item)=>{
                        if(item.id==id){
                            item.check=$(this).prop('checked')
                        }
                        return item
                    })
                    localStorage.setItem('cart',JSON.stringify(_this.cart))
                _this.setcheckAll()
                _this.allPay()
                _this.setMore()
               _this.allCheck()





                })
               

            }
            //设置全选
            setcheckAll(){
               $('#checkBox').prop('checked',this.cart.every(item=>item.check))
               this.allPay()
               header.suanCar()
               this.allCheck()
            }
            //设置反选
            setnoCheckall(){
                const that=this
                $('#checkBox').on('change',function(){
                   that.cart=that.cart.map((item)=>{
                        item.check=$(this).prop('checked')
                        return item
                    }
                    )
                    localStorage.setItem('cart',JSON.stringify(that.cart))
                    $('.changeBox').prop('checked',$(this).prop('checked'))
                   that.allPay()
                 header.suanCar()
               that.allCheck()
                })
               

            }
            //计算总价
            allPay(){
                const allpay=this.cart.reduce((money,shop)=>{
                    if(shop.check){
                        money+=shop.price*shop.count
                    }
                    return money
                },0)
                $('.info3').html((allpay).toFixed(2))
                $('.info').html((allpay).toFixed(2))

               } 
             //计算选中的商品总数
             allCheck(){
                const allCheck=this.cart.reduce((check,shop)=>{
                    if(shop.check){
                       check+=shop.count
                    }
                    return check
                },0)
                $('#check-goods span').html(allCheck)

             }  
            //编辑数量增减事件
            //当点击+号时，首先取到localstorage 里当前id商品的数量 然后 count++ 最后再存入LO 渲染页面 
           setMore(){
               const _this=this
               $('.more').on('click',function(){
                   let id=$(this).parents('.shopCar-list').attr('data-id')
                   _this.cart=_this.cart.map((item)=>{
                       if(item.id==id){
                           item.count++
                       }
                       return item
                   })
                   let i=-1
                  _this.cart.map((item,index)=>{
                      if(item.id==id){
                          i=index
                      }
                      return i
                  })
                  
                   localStorage.setItem('cart',JSON.stringify(_this.cart))
                   $(this).prev().val(_this.cart[i].count)
                   _this.allPay()
                 _this.renderBuycar()
                header.suanCar()
              _this.allCheck()
               })
              
           }
           //当点击－号时，首先判断input里的值是否为0，如果为0 出弹框 ，如果不为0 减少数目
           setLittle(){
            const _this=this
            $('.little').on('click',function(){
             let id=$(this).parents('.shopCar-list').attr('data-id')
             let j=-1
             if(
                 $(this).next().val()==1
             ){
                
                 alert('不可以再减少了哦')
                 return
             }
             else{
                _this.cart=_this.cart.map((item)=>{
                    if(item.id==id){
                        item.count--
                    }
                    return item
                })
               
                _this.cart.map((item,index)=>{
                    if(item.id==id){
                        j=index
                    }
                    return j
                })
             }
             localStorage.setItem('cart',JSON.stringify(_this.cart))
             $(this).next().val(_this.cart[j].count)
             _this.allPay()
             _this.allCheck()
             _this.renderBuycar()
             header.suanCar()
            })
           }
           //输入改变商品数量
           setInput(){
               const _this=this
               $('.shuliang').on('blur',function(){
               let shu=$(this).val()
                   //把这个数量改变到 localstorage里面
              let id=$(this).parents('.shopCar-list').attr('data-id')
              
             _this.cart=_this.cart.map((item)=>{
                if(item.id==id){
                    item.count=shu
                }
                return item
            })
            let j=-1
            _this.cart.map((item,index)=>{
                if(item.id==id){
                    j=index
                }
                return j
            })
            localStorage.setItem('cart',JSON.stringify(_this.cart))
            var num =+_this.cart[j].count
           $(this).val(num)
           _this.allCheck()
           _this.allPay()
           _this.renderBuycar()
        }
               )
           }
        //删除商品
        // 当点击删除时，找到当前Id所对应的localstorage 里面的那条商品 删除这个数组里的这条数据 
        delete(){
            const _this=this
            $('.delete').on('click',function(){
              
                if(  confirm('确定要删除吗？')){
                         
            let id=$(this).parents('.shopCar-list').attr('data-id')
            let j=-1
            if(_this.cart.length!==0){
                _this.cart.map((item,index)=>{
                    if(item.id==id){
                        j=index
                    }
                    return j
   
                })
              _this.cart= _this.cart.filter((item,index)=>{
                   return index!=j
               })
               localStorage.setItem('cart',JSON.stringify(_this.cart))
               $(this).parents('.shopCar-list').remove()
               _this.allPay()
                header.suanCar()
               _this.allCheck()
          if(_this.cart.length==0){
            $('.noshoes').show()
          }
            }else {
                 header.suanCar()
                 renderBuycar()
            }
                }
                else{
                    return
                }
            })
        }
        }
          new buyCar()
            })
    })